layui.use(['laypage', 'layer', 'table', 'element', 'jquery'], function() {
    var laypage = layui.laypage //分页
        , layer = layui.layer //弹层
        , table = layui.table //表格
        , $ = layui.jquery
        , element = layui.element; //元素操作

    var table_format_deployment = [[
            {field: 'id', align: 'center', title: 'ID', width: 60}
             , {field: 'zcellname', align: 'center', title: 'zcell服务器名称', width: 200}
             , {field: 'nodenumber', align: 'center', title: '模块数量', width: 200}
             , {field: 'companynumber', align: 'center', title: '公司数量', width: 200}
             , {field: 'zcellip', align: 'center', title: 'zcell外网IP', width: 200}
             , {fixed: 'right',width: 300, align: 'center', toolbar: '#debarDemo'}
        ]];

    // var deployment_data = [
    //     {
    //         "id": 1,
    //         "zcellname": "zcell01",
    //         "nodenumber": 4,
    //         "companynumber": 3,
    //         "zcellip": '127.0.0.1'
    //     }
    // ];


    $('.layui-table').each(function() {
        //获取标签对于的一个属性
        var $obj = $(this);
        var tableid = $obj[0].id;
        var etaleid = '#' + tableid;
        var toolid = 'tool(' + tableid + ')';
        //var tableid = document.getElementById('update').id;
        console.log(tableid);
        createtable(etaleid,tableid,deployment_data,table_format_deployment);
        deploymentool(toolid,tableid);
    });



    //执行渲染
    function createtable(etaleid,tableid,datas,table_format) {
        table.render({
            elem: etaleid,
            id: tableid,
            //url: '/demo/table/user/',
            limit:10,
            page: true,
            stateSave: true, //是否打开客户端状态记录功能,此功能在ajax刷新纪录的时候不会将个性化设定回复为初始化状态
            processing: true, //DataTables载入数据时，是否显示‘进度’提示
            scrollCollapse: true, //是否开启DataTables的高度自适应，当数据条数不够分页数据条数的时候，插件高度是否随数据条数而改变
            searching: true, //是否允许Datatables开启本地搜索
            data:datas,
            cols:table_format
        });

        active = {
            getCheckLength: function () {
                var checkStatus = table.checkStatus('update');
                var data = checkStatus.data;
                layer.msg('选中了：' + data.length + ' 个');
            },
            Deployment: function () {
                //配置一个透明的询问框
                layer.msg('将对所有zecell进行更新，请确认更新文件是否已经放置到位！', {
                    time: 20000,
                    //20s后自动关闭
                    btn: ['更新', '取消'],
                    success: function (layero) {
                        var btn = layero.find('.layui-layer-btn');
                        btn.css('text-align', 'center');
                    }
                });
            },
            Update: function () {
                //示范一个公告层
                var checkStatus = table.checkStatus('update');
                var data = checkStatus.data;
                if (data.length === 0) {
                    layer.msg('没有选中数据');
                } else {

                    layer.open({
                        type: 1,
                        title: false, //不显示标题栏
                        closeBtn: false,
                        area: '300px;',
                        shade: 0.8,
                        maxHeight: 600,
                        id: 'LAY_layuipro', //设定一个id，防止重复弹出
                        btn: ['确认更新', '返回修改'],
                        moveType: 1, //拖拽模式，0或者1
                        content: updatelist(data),
                        success: function (layero) {
                            var btn = layero.find('.layui-layer-btn');
                            btn.css('text-align', 'center');
                            btn.find('.layui-layer-btn0').attr({
                                href: 'http://www.layui.com/',
                                target: '_blank'
                            });
                        }
                    });
                }
            }
        };
    }

    function deploymentool(toolid, tableid) {
        //监听工具条
        //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
        table.on(toolid, function (obj) {
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值
            var tr = obj.tr; //获得当前行 tr 的DOM对象
            var checkStatus = table.checkStatus(tableid);
            // var json_company = JSON.parse(company_data);
            var companydata = company_data[data["zcellname"]];
            console.log(companydata);
            if (layEvent === 'company_detailsnu') {
                layer.msg(
                    content=deploymenlist(companydata),
                    {
                    time: 200000,
                    //200s后自动关闭
                    btn: ['确定'],
                    success: function (layero) {
                        var btn = layero.find('.layui-layer-btn');
                        btn.css('text-align', 'center');
                    }
                });
            } else if (layEvent === 'deploymentnu') {
                var username = $(this).html();
                var href = 'add_deployment.html' + '/v1' + data["zcellname"] + 'v2' + data["zcellip"];
                layer_show(username, href, '', '600', '400')
            }
        });
    }


    function deploymenlist(companydata) {
        var contxt = '<div style="padding: 50px; line-height: 22px; font-weight: 300; text-align:center">';
        for (var i = 0; i <= companydata.length; i++) {
            if (i === companydata.length) {
                contxt = contxt + '</div>'
            } else {
                contxt = contxt + companydata[i]["companyname"] + ' : ' + companydata[i]["module"] + '<br>'
            }
        }
        console.log(contxt);
        return contxt
    }

    $('.demoTable .layui-btn').on('click',
    function() {
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
    });
});